<template>
	<div>
		<div class="layout-breadcrumb">
			<Breadcrumb>
			    <BreadcrumbItem to="/">首页</BreadcrumbItem>
			    <BreadcrumbItem href="">功能</BreadcrumbItem>
			    <BreadcrumbItem to="/wechat/function/reply">自动回复</BreadcrumbItem>
			    <BreadcrumbItem href="/function/reply/update">更新回复</BreadcrumbItem>
			</Breadcrumb>
		</div>
		<div class="layout-content">
		    <div class="layout-content-main">
		    	<IForm :model="form" ref="form" :label-width="100" :rules="formRule" >
		    		<FormItem prop="name" label="规则名称">
			            <IInput v-model="form.name" size="large" placeholder="输入规则名称" clearable />
			        </FormItem>
			        <FormItem prop="keyword" label="关键词">
			            <IInput v-model="form.keyword" size="large" placeholder="输入关键词" clearable />
			        </FormItem>
			        <FormItem prop="replyType" label="回复内容">
						<ReplyItem ref="reply" :callback="getChoiseReply"></ReplyItem>
			        </FormItem>
			        <FormItem>
			        	<Button type="primary" @click="submit('form')">提交</Button>
			        </FormItem>
		    	</IForm>
		    </div>
		</div>
	</div>
</template>
<script>
	import {Breadcrumb,Button,Form,Input} from 'view-design';

    import ReplyItem from 'admin/components/wechat/function/reply/reply-item';

	export default{
		data () {
			const validateKeyWord = (rule, value, callback) => {
                this.Axios.Wechat.Function.Reply.Check({id:this.form.id,keyword:this.form.keyword})
                .then(res =>{
                    if(!res){
                    	callback();return false;
                    }
                    if(res.code==1){
                    	callback(new Error(res.msg));return false;
                    }
                    
                })
                callback();
            };
            return {
                form :{
					id : 0,
					name : '',
					keyword : '',
					replyType : '',
					wechat_text_id : 0,
					wechat_image_id : 0,
					wechat_mpnews_id : 0,
                },
               
				formRule: {
	                name: [{ required: true, message: '请填写规则名', trigger: 'blur' }],
	                keyword: [
	                	{ required: true, message: '请填写关键词', trigger: 'blur' },
	                	{ validator: validateKeyWord, trigger: 'blur' }
	                ],
	                replyType: [{ required: true, message: '请选择一个回复项'}],
	            }
            }
        },
		components:{
            Breadcrumb,
            "BreadcrumbItem" : Breadcrumb.Item,
            'IInput' : Input,
			'IForm' : Form,
			'FormItem' : Form.Item,
			Button,
			ReplyItem,
        },
        methods: {
        	submit(name){
        		this.$refs[name].validate((valid) => {
	                if (!valid) {
	                    return false;
	                }
	               	this.Axios.Wechat.Function.Reply.Update(this.form)
	                .then(res =>{
	                    if(!res) return false;
	                    this.$router.push('/wechat/function/reply?type=keyword');
	                })
	            })
        	},
            resetReply(){
                this.replyType = '';
                this.wechat_text_id = 0;
                this.wechat_image_id = 0;
                this.wechat_mpnews_id = 0;
            },  
            //获取选中的回复项目数据
            getChoiseReply(reply){
                this.resetReply();
                this.form.replyType = reply.replyType;
                this.form.wechat_text_id = reply.wechat_text_id;
                this.form.wechat_image_id = reply.wechat_image_id;
                this.form.wechat_mpnews_id = reply.wechat_mpnews_id;
            }
        },
        created: function() {
	        if(this.$route.params.id===undefined) return false;
	        var id = this.$route.params.id;

	        this.Axios.Wechat.Function.Reply.Get(id)
	            .then(res =>{
	                if(!res) return false;
	                var data = res.data;
	                this.form.id = data.id;
	                this.form.name = data.ruleName;
	                this.form.keyword = data.keyword;
	                this.form.replyType = data.reply.replyType;
	                this.form.wechat_text_id = data.reply.wechat_text_id;
        			this.form.wechat_image_id = data.reply.wechat_image_id;
        			this.form.wechat_mpnews_id = data.reply.wechat_mpnews_id;
        			this.$refs.reply.setChoise(data.reply);
	            })
		}
	}
</script>